<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:pho="http://www.hitachivantara.com">
    <head>
        <title>Message Box Test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

        <link rel="stylesheet" type="text/css" href="../dojo/dijit/themes/pentaho/pentaho.css"/>

        <script type="text/javascript" src="webcontext.js?content=common-ui"></script>

        <script type="text/javascript">
        //<![CDATA[

        $.extend(djConfig, { modulePaths: {
                                'pentaho.common': "../pentaho/common"
                            },
                            parseOnLoad: true,
                            baseUrl: '../dojo/dojo/'
                        });


          //]]>
        </script>


        <script language='javascript' type='text/javascript' src='../dojo/dojo/dojo.js.uncompressed.js'></script>
        <script language='javascript' type='text/javascript' src='../dojo/dojo/dojo-ext.js.uncompressed.js'></script>


        <script type="text/javascript">

            dojo.require("dojo.parser");
            dojo.require("pentaho.common.MessageBox");

            var msgBox = null;

            function doload() {

                try {

                    dojo.parser.parse();
                    // configure the message box
                    msgBox = dijit.byId('messagebox');
                    // set the title
                    msgBox.setTitle('The Title');
                    // set the message
                    msgBox.setMessage('This is the message');
                    // set the button callbacks
                    msgBox.callbacks = [
                        dojo.hitch(this, okFunc), 
                        dojo.hitch(this, cancelFunc)
                    ];
                    
                    // set the buttons
                    msgBox.setButtons(['Ok','Cancel']);

                    // show the message box
                    msgBox.show();
                } catch (e) {
                    alert(e.message)
                }
            }
                
            dojo.ready(doload);
            
            // this is the function called when the ok button is clicked
            function okFunc() {
                alert('ok function called');
                msgBox.hide();
            }

            // this is the function called when the cancel button is clicked
            function cancelFunc() {
                alert('Cancel function called');
                msgBox.hide();
            }

        </script>

    </head>

    <body class="tundra body">

        <!-- this button can be used to show the message box again after it has been dismissed -->
        <button onclick="msgBox.show()">Show Message Box</button>

        <!-- this is the definition of the message box -->
        <div id="messagebox" dojoType="pentaho.common.MessageBox" style="width:250px; display:none;" onKeyUp="">
        </div>

    </body>
  
</html>
